<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ include file="../include/header.jsp" %>

<div id="main">
    <div id="container">
        <div id="content">
            <div id="${requestScope['id']}" class="hentry p1 post publish author-admin category-blogs category-companies tag-blue tag-brown comments-open pings-closed y2009 m08 d16 h13 slug-envira-media">

                <div class="entry-content">
                    <h1>${requestScope['nom']}</h1>
                    <p>${requestScope['description']}</p>
                    <ul class="meta">
                        <li class="designer">Photographe : ${requestScope['photographe']}</li>
                        <li class="notation">
                            <input name="star1" type="radio" class="rating-star" id="star1" value="1" title="Mauvais"/>
                            <input name="star1" type="radio" class="rating-star" id="star2" value="2" title="Bof"/>
                            <input name="star1" type="radio" class="rating-star" id="star3" value="3" title="Sympa"/>
                            <input name="star1" type="radio" class="rating-star" id="star4" value="4" title="Superbe"/>
                            <input name="star1" type="radio" class="rating-star" id="star5" value="5" title="Awesome!!!"/>
                            <input type="hidden" id="idAlbum" value="${requestScope['id']}" />
                            <span id="hover-star">/5</span>
                            <div style="clear:both"></div>
                            <br />
                            Note des utilisateurs : <span id="noteUser">${requestScope['score']}</span>
                        </li>
                        <c:if test="${ sessionScope['id']==requestScope['idAuteur'] }">
                            <li class="photo"><a href="AlbumServlet?action=edit&IdAlbum=${requestScope['id']}&add=1">Ajouter des photos</a></li>
                            <li class="photo"><a href="AlbumServlet?action=edit&IdAlbum=${requestScope['id']}">Modifier l'album</a></li>
                        </c:if>
                        <li class="slideshow"><a id="slideshow" href="#">Lancer le diaporama</a></li>
                        <c:if test="${ sessionScope['id']==requestScope['idAuteur'] }">
                            <li class="share"><a href="AlbumServlet?action=partager&id=${requestScope['id']}" id="popupRun">Partager</a></li>
                        </c:if>
                        <c:if test="${ sessionScope['id']==requestScope['idAuteur'] }">
                            <li>
                                <form method="POST" action="ExportServlet">
                                    <label for="source">Exporter vers </label>
                                    <select name="source" id="source">
                                        <option value="1">Facebook</option>
                                        <option value="2">Picasa</option>
                                        <option value="3">Flickr</option>
                                    </select>
                                    <input type="submit" value="Go !"/>
                                    <input type="hidden" name="idAlbum" id="idAlbum" value="${requestScope['id']}"/>
                                </form>
                                    <c:if test="${!empty message}">
                                        <span style="font-style: italic;">${message}</span>
                                    </c:if>
                            </li>
                        </c:if>
                        <c:if test="${ sessionScope['id']==requestScope['idAuteur'] }">
                            <li class="delete">
                                <a href="AlbumServlet?action=delete&IdAlbum=${requestScope['id']}">Supprimer l'album</a>
                            </li>
                        </c:if>
                        <!--<li class="twitter">
                            <a href="" title="Share Envira Media on Twitter">Tweet This</a>
                        </li>-->
                    </ul>
                    <!--<div id="nav-below" class="navigation">
                    </div>
                    <p id="ggmaps">
                        <img src="./style/images/staticmap.png" width="385" height="385"/>
                    </p>-->
                </div>
            </div><!-- .post -->

            <div  style="float:left;  margin-left: -935px">
                <c:if test="${empty lstPhotos}">
                    <div class="message-box alert" style="width:500px;">
                        Il n'y a pas de photos dans cet album.<br />
                        <c:if test="${ sessionScope['id']==requestScope['idAuteur'] }">
                            Si vous souhaitez en ajouter, c'est par là<br />
                            <a href="AlbumServlet?action=edit&IdAlbum=${requestScope['id']}&add=1">Ajoutez des photos</a>
                        </c:if>
                    </div>
                </c:if>
                <c:if test="${!empty lstPhotos}">
                    <table>
                        <c:set value="0" var="i"/>
                        <c:forEach var="photo" items="${lstPhotos}">
                            <c:if test="${i%3 == 0}">
                                <tr>
                                </c:if>
                                <td>
                                    <div class="artwork-container">
                                        <div class="entry-artwork">
                                            <a href="PhotoServlet?action=view&IdPhoto=${photo.id}">
                                                <img src="upload/${requestScope['idAuteur']}/${requestScope['id']}/${photo.pathThumbList}" />
                                            </a>
                                            <br />
                                            <a rel="color" title="${photo.nom}" href="upload/${requestScope['idAuteur']}/${requestScope['id']}/${photo.pathFile}" id="box_${requestScope['id']}">
                                                <img src="style/images/icons/zoom_in.png" />
                                            </a>
                                            <a href="PhotoServlet?action=view&IdPhoto=${photo.id}">
                                                <img src="style/images/icons/comments.png" />
                                            </a>
                                        </div><!-- /.entry-artwork -->
                                    </div><!-- /.artwork-container -->
                                </td>
                                <c:set value="${i+1}" var="i"/>
                                <c:if test="${i%3 == 0}">
                                </tr>
                            </c:if>
                        </c:forEach>
                    </table>
                </c:if>

            </div>
        </div><!-- #content -->
    </div><!-- #container -->
</div><!-- #main -->
<script type="text/javascript">
    $(function(){
        $("a[rel='color']").click(function(){
            $("a[rel='color']").colorbox({maxHeight:"90%",maxWidth:"90%",slideshow: false});
        });
        $("#slideshow").click(function(){
            $("a[rel='color']").colorbox({
                maxHeight:"90%",
                maxWidth:"90%",
                slideshow: true,
                open:true
            });
        });
        $.getJSON(
        "RatingServlet",
        {
            action : "get",
            ia : $("#idAlbum").val()
        },
        function(data){
            if(data.ret)
            {
                if(data.score == "NaN")
                {
                    $("#noteUser").html("0/5");
                }
                else
                {
                    $("#noteUser").html(data.score+"/5");
                }
                $("input#star"+data.me).attr("checked","checked");
                $("#hover-star").html("Votre note : "+data.me);
                   
                /* Rating Star */
                $('.rating-star').rating({
                    callback: function(value, link){
                        var idAlbum = $("#idAlbum").val();
                        if(value)
                        {
                            $.getJSON(
                            "RatingServlet",
                            {
                                action : "submit",
                                ia : idAlbum,
                                s : value
                            },
                            function(data){
                                if(data.ret)
                                {
                                    $("#noteUser").html(data.score+"/5");
                                    $("#hover-star").html("Votre note : "+data.me);
                                }
                            }
                        );
                        }
                        else
                        {

                        }
                    }

                });
            }
        }
    );
       

    });
</script>
<%@ include file="../include/footer.jsp" %>
